<template>
    <div class="h-full flex flex-col">
        <div class="wrapper h-full" ref="scrollRef">
            <div class="p-0">
                <div class="bg-zinc-300 m-1" v-for="(item, index) in state.list" :key="index">
                    <div class="text-zinc-400">{{ item.name }}</div>
                </div>
            </div>
        </div>
    </div>
</template>
<script setup>
let list = []
for (let index = 0; index < 20; index++) {
    list.push({
        name: '是的是烦得很放地方好的好地方地方好的地方',
    })
}
let state = reactive({
    list,
    scrollRef: undefined,
})

onMounted(() => {
    let bs = new BScroll(state.scrollRef, {
        scrollbar: true,
        probeType: 3,
        click: true,
    })
})

defineExpose({})
const { scrollRef } = toRefs(state)
</script>
